<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>属性绑定指令 'v-bind:' &简写 ':'</title>
    <script src="../lib/vue-2.6.12.js"></script>
</head>
<body>
    <div id="app">
        <!-- vue 规定 v-bind: 指令可以简写为 :-->
        <!--  <input type="text" v-bind:placeholder="tips">-->
        <input type="text" :placeholder="tips">
        <hr>
        <img :src="photo">
        <hr>
        <div>
            {{tips}} 反转的结果是: {{tips.split('').reverse().join('')}}
        </div>
        <div :title="'box'+index">在这div里改变title</div>

    </div>



    <script>
      const vm = new Vue({
          el:'#app',
          data:{
              tips:'请输入用户名',
              photo:'',
              index: 1
          }
      })
    </script>

</body>
</html>